/*
 * 查房列表
 * @author 醉雪
 * @time 2018/10/17
 * @since 1.0.0
 * */
// React基础组件
import React from 'react'
// dva 连接组件 - 连接route和model
import { connect } from 'dva'
// 引入antd的组件
import { Form, Select, Input, DatePicker, Button, Popconfirm, Row, Col, Cascader, message, Radio } from 'antd'
import moment from 'moment';
const { RangePicker } = DatePicker;
const dateFormat = 'YYYY/MM/DD';
//导入路由组件，用于跳转等
import { Link, hashHistory } from 'dva/router'
// 导入项目全局配置文件
import config from 'config/config'

// 引入model取值工具方法
import { mapStateToProps } from 'utils/view_utils'
// 当前组件样式
import styles from './editConsultantStyle.less'
import classnames from 'classnames/bind';
let cx = classnames.bind(styles);
//引用listPage
import ListPage from 'widget/PageTmpl/ListPage'
import UserPop from 'widget/UserPop/UserPop'
import { CollapsiblePanels } from 'widget/CollapsiblePanels/index'
const Option = Select.Option;
const FormItem = Form.Item;
const formItemLayout = {
  labelCol: {
    span: 2
  },
  wrapperCol: {
    span: 10
  },
}
/**
 * description 路由视图及事件处理
 * dispatch 分发到models中的effects对应事件名
 * model 用于获取models中state定义的数据
 * form 表单对象
 */

const infoListAdminView = function ({ dispatch, model, form }) {
  // 表单的子函数
  const { resetFields, getFieldDecorator, validateFields, setFieldsValue } = form
  // 取出model对象，命名空间
  const { modelObj, namespace } = model
  // modelObj.xxx获取model中状态机的值
  let { areaList, showAddVisible, projectList, createConsultantParams,actionType, type, isHasScore, lock,flagZeroId } = modelObj;
  //关闭弹出
  function onCancel() {
    dispatch({
      type: `${namespace}/updateStore`,
      payload: { showAddVisible: false }
    })
  }
  function onSubmit(obj) {
    console.log("ggg==", obj);
    createConsultantParams.name = obj.name ||"";
    createConsultantParams.idCardNo = obj.idCardNo||"";
    createConsultantParams.serialNumber = obj.serialNumber || '';
    createConsultantParams.mobile = obj.mobile || '';
    createConsultantParams.sex = obj.sex||'';
    createConsultantParams.uid = obj.uid||'';
    createConsultantParams.displayAvgPoints = obj.displayAvgPoints||''
    dispatch({
      type: `${namespace}/updateStore`,
      payload: { createConsultantParams }
    })
    console.log(createConsultantParams);
  }
    //输入框改变时
    function inputChange(e, type, idx) {
        createConsultantParams[type] = e
        dispatch({
            type: `${namespace}/updateStore`,
            payload: { createConsultantParams }
        });
        console.log(e, type)
    }
  function onshow() {
    dispatch({
      type: `${namespace}/updateStore`,
      payload: { showAddVisible: true }
    })
  }
  function selectCity(val) {
    createConsultantParams.province = val[0];
    createConsultantParams.city = val[1];
    createConsultantParams.productId = '';
    dispatch({
      type: `${namespace}/updateStore`,
      payload: { createConsultantParams }
    })
    // 获取项目列表
    dispatch({ type: `${namespace}/getHouseProjectList`, payload: { province: val[0], city: val[1] } });
    console.log(val, createConsultantParams);
  }
  function selctProject(val) {
    createConsultantParams.productId = val;
    dispatch({
      type: `${namespace}/updateStore`,
      payload: { createConsultantParams }
    })
    console.log(createConsultantParams);
  }

  function updateModel(value, key, obj){
    createConsultantParams[key] = value
    dispatch({
        type: `${namespace}/updateStore`,
        payload: { createConsultantParams }
    })
  }

  function sureAddConsultant() {
    if (type != 'edit') {
      dispatch({ type: `${namespace}/createHouseConsultant`, payload: { ...createConsultantParams } });
    } else {
      dispatch({ type: `${namespace}/updateConsultantInfo`, payload: { ...createConsultantParams } });
    }
  }
  return (
    <div className={cx('public_listMain')}>
      <div className="functionButton">
        {
          !lock && <div className={cx('sure')}>
            <Button type="primary" onClick={e =>{
              form.validateFields((err) => {
                if(!err){
                  sureAddConsultant()
                }
            });
              
            }} loading={modelObj.btnLoading}>确定</Button>
          </div>
        }
      </div>

        <div className={'boxShadow'}>
            <div  >
                <Form autoComplete="off" className="auto-wrap">
                  <Row style={{ borderBottom: "1px solid #EFF0F2" }}>
                      <Col span={8}>
                          <FormItem {...formItemLayout} label="置业顾问" labelCol={{ span: 5 }}>
                              <div className={cx('select-item-contain')}>
                                  {getFieldDecorator('name', {
                                      initialValue: createConsultantParams.name,
                                      rules: [
                                          { required: true, whitespace: true, message: '请输入置业顾问姓名' },
                                      ],
                                      })(<Input
                                      placeholder={'请输入置业顾问姓名'}
                                      disabled={actionType == 'check'}
                                      autoComplete={'off'}
                                      onChange={(e) => { updateModel(e.target.value, 'name', 'createConsultantParams') }}
                                  />)}
                              </div>
                          </FormItem>
                      </Col>

                      <Col span={8}>
                          <FormItem {...formItemLayout} label="手机号码" labelCol={{ span: 5 }}>
                              <div className={cx('select-item-contain')}>
                                  {getFieldDecorator('mobile', {
                                      initialValue: createConsultantParams.mobile,
                                      rules: [
                                          { required: true, whitespace: true, message: '请输入置业手机号码' },
                                      ],
                                      })(<Input
                                      placeholder={'请输入置业手机号码'}
                                      disabled={actionType == 'check'}
                                      autoComplete={'off'}
                                      onChange={(e) => { updateModel(e.target.value, 'mobile', 'createConsultantParams') }}
                                  />)}
                              </div>
                          </FormItem>
                      </Col>

                    </Row>
                    <Row style={{ borderBottom: "1px solid #EFF0F2" }}>
                      <Col span={8}>
                        <FormItem {...formItemLayout} labelCol={{ span: 5 }}
                            label="关联房源">
                            {getFieldDecorator('productId', {
                              initialValue: createConsultantParams.productId,
                              rules: [
                                { required: true, whitespace: true, message: '请选择房源' },
                              ],
                            })(<Select placeholder="请选择房源" onChange={(val) => updateModel(val, 'productId', 'createConsultantParams')} disabled={actionType == 'check'}>
                              {
                                projectList.map(it =>{
                                    return <Select.Option value={it.productId}>{it.name}</Select.Option>
                                })
                              }
                            </Select>)}
                          </FormItem>
                      </Col>

                      <Col span={8}>
                        <FormItem {...formItemLayout} label="性别" labelCol={{ span: 5 }} >
                            <div className={cx('select-item-contain')}>
                                {getFieldDecorator('sex', {
                                    initialValue: createConsultantParams.sex + '',
                                    rules: [
                                        { required: false, whitespace: true, message: '请选择性别' },
                                    ],
                                    })(<Radio.Group  value={createConsultantParams.sex} disabled={actionType == 'check'} onChange={(e) => { updateModel(e.target.value, 'sex', 'createConsultantParams') }}>
                                        <Radio value={"0"}>女</Radio>
                                        <Radio value={"1"}>男</Radio>
                                      </Radio.Group>)}
                            </div>
                          </FormItem>
                      </Col>
                    </Row>
                </Form>
            </div>
      </div>
      {
        showAddVisible ? <UserPop
          title={"选择置业顾问"}
          visible={true}
          width={1000}
          onOk={(obj) => onSubmit(obj)}
          onCancel={() => onCancel()}
        /> : null
      }
    </div>
  )
}

// 连接视图(view)和模型(model)
export default connect(mapStateToProps)(Form.create()(infoListAdminView))
